<template>
    <div class="cancleTask">
        <div class="title">
            <i class="iconfont iconzuojiantou" @click="onClickLeft"></i>
            <span>取消任务</span>
            <i class="iconfont iconzuojiantou" style="color: white;"></i>
        </div>
        <div class="content">
            <h3>取消原因:</h3>
            <textarea placeholder="请输入取消原因" v-model="value"></textarea>
        </div>
        <div class="submitBtn" @click="cancleTask">
            确认提交
        </div>
    </div>
</template>

<script>
import { Toast } from 'vant';
export default {
    name:"cancleTask",
    data (){
        return {
            value:''
        }
    },
    created (){

    },
    methods:{
        onClickLeft() {
             this.$router.go(-1);
        },
        cancleTask (){
            this.$axios.post('/user/mytask/edit',{
                id:this.$route.query.id,
                applyType: this.$route.query.applyType,
                cancelReason:this.value
            }).then(res =>{
                //   console.log(res)
                if(res.data.code==0){
                    Toast(res.data.msg)
                    this.$router.push('/task')
                }else{
                    Toast(res.data.msg)
                }

            })
        }
    }
  }
</script>

<style lang="less" scoped>
.cancleTask{
    width: 100%;
    height: 100%;
    position: relative;
    font-size: 0;
    .title {
        width: 100%;
        font-size: 0.36rem;
        color: #333;
        height: 1.25rem;
        line-height: 1.25rem;
        background-color: #fff;
        display: flex;
        justify-content: space-between;
        padding: 0 0.2rem;
        box-sizing: border-box;
    }
    .content{
        padding:0.2rem 0.3rem 0.3rem;
        box-sizing: border-box;
        background-color: #fff;
        font-size: 0.26rem;
        color:#666;
        margin-top:0.1rem;
        textarea{
            padding:0.2rem;
            box-sizing: border-box;
            width: 100%;
            height: 3.74rem;
            font-size: 0.24rem;
            color:#999;
            margin-top:0.2rem;
            border: 1px solid #D9D9D9;

        }
    }
    .submitBtn{
        width:6.82rem;
        height:.92rem;
        background:rgba(56,168,63,1);
        border-radius:.46rem;
        line-height: 0.92rem;
        color:#fff;
        border-radius: 0.46rem;
        margin:0 auto;
        text-align: center;
        margin-top:1.05rem;
        font-size: 0.32rem;
    }
}
</style>
